<!--商家管理-分区管理-->
<template>
  <div class="video-list-manage-parent" ref="parentContainer">
    <!--操作表单区域-->
    <div class="option-parent" ref="optionParentContainer">
      <el-row :gutter="0">
        <el-col :span="6">
          <el-button type="primary" @click="showAddTopTypes()">添加</el-button>
        </el-col>
      </el-row>
    </div>

    <!--数据表格区域-->
    <div v-bind:style="{height:tableHeight+'px',width:'100%'}" v-loading="loading">
      <el-table :data="agentPartitionData.agent_area_list" border width="100%" height="100%">
        <el-table-column
          prop="areaid"
          label="分区ID"
          min-width="150">
        </el-table-column>
        <el-table-column
          prop="areaname"
          label="分区名称"
          min-width="150">
        </el-table-column>
        <el-table-column
          prop="sellers"
          label="商户数量"
          min-width="150">
        </el-table-column>
        <el-table-column
          prop="riders"
          label="骑手数量"
          min-width="150">
        </el-table-column>
        <el-table-column label="操作" width="150">
          <template slot-scope="scope">
            <el-button
              size="mini"
              @click="showModifyTypes(scope.row)">编辑
            </el-button>
            <el-button
              size="mini"
              @click="deleteTypes(scope.row)">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <!--翻页区域-->
    <div class="pagination-parent" ref="paginationParentContainer">
    </div>

  </div>
</template>

<script>
  import CPageBase from "../fragment/CPageBase"
  import CRootBase from "../fragment/CRootBase"

  export default {
    data() {
      return {
        pathArr: [
          {path: "/", name: "首页"},
          {path: "/container/seller_partition", name: "分区管理"},
        ],
        category: "",
        loading: false,
        agentPartitionData: "",//代理商的商户数据
      }
    },
    mixins: [CPageBase, CRootBase],
    components: {},
    mounted() {

    },
    activated() {
      this.initCurrentPath();
      this.requestAgentPartiong()
    },
    methods: {
      //初始化面包屑路径
      initCurrentPath() {
        this.$store.commit('changeCurrentLocation', this.pathArr);
      },

      // 分区添加对话框
      showAddTopTypes() {
        let that = this;
        this.$prompt('请输入分区名称', '添加分区', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
        }).then(({value}) => {
          that.requestAddTopTypes(value);
        }).catch(() => {
          //取消
        });
      },

      // 分区添加请求
      requestAddTopTypes(name) {
        let parameter = new URLSearchParams();
        parameter.append("action", "agent_area_create");
        parameter.append("areaname", name);
        let that = this;
        that.loading = true;
        this.$http.requestAuthData(that, parameter, function (data) {
          that.$message({type: 'success', message: '添加成功!'});
          that.requestAgentPartiong();
        });
      },


      //分区修改对话框
      showModifyTypes(item) {
        let that = this;
        this.$prompt('请输入分区名称', '修改分区', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          inputValue: item.areaname
        }).then(({value}) => {
          that.requestModifyTypes(value, item.areaid);
        }).catch(() => {
          //取消
        });
      },

      //分区修改请求
      requestModifyTypes(name, id) {
        let that = this;
        let parameter = new URLSearchParams();
        parameter.append("action", "agent_area_modify");
        parameter.append("areaid", id);
        parameter.append("areaname", name);
        that.loading = true;
        this.$http.requestAuthData(that, parameter, function (data) {
          that.$message({type: 'success', message: '修改成功!'});
          that.requestAgentPartiong();
        });
      },

      //分区删除
      deleteTypes(item) {
        let that = this;
        this.$confirm('此操作将永久删除该分区, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          that.requestDeleteTypes(item);
        });
      },

      //分区删除请求
      requestDeleteTypes(item) {
        let that = this;
        let parameter = new URLSearchParams();
        parameter.append("action", "agent_area_delete");
        parameter.append("areaid", item.areaid);
        that.loading = true;
        this.$http.requestAuthData(that, parameter, function (data) {
          that.$message({type: 'success', message: '删除成功!'});
          that.requestAgentPartiong();
        });
      },


      // 代理商的分区列表
      requestAgentPartiong() {
        let parameter = new URLSearchParams();
        parameter.append("action", "agent_area_list");
        let that = this;
        that.loading = true;
        this.$http.requestAuthData(that, parameter, function (data) {
          that.agentPartitionData = data;
        });
      }
    }
  }
</script>

<style lang="scss" scoped="" type="text/scss" src="../../assets/style/list-type-pages.scss">
</style>

